<template>


   <div class="app-container flex flex-col">
     <div class="app-container__section shrink-0">
       <plus-search
         v-bind="getSearchBinds()"
         :columns="columns"
         label-width="110px"
       ></plus-search>
     </div>
     <div class="app-container__section flex-1 shrink-0">
       <plus-table
         :columns="columns"
         v-bind="getBinds()"
       >
         <template #title>
           <table-title/>
         </template>
         <template #plus-cell-jobGroup="scope">
           <dict-tag :options="sys_job_group" :value="scope.row.jobGroup" />
         </template>
         <template #toolbar>
           <el-button
             type="danger"
             plain
             icon="Delete"
             :disabled="gSelection.length !== 0"
             @click="handleDelete"
             v-hasPermi="['monitor:job:remove']"
           >删除</el-button>
           <el-button
             type="danger"
             plain
             icon="Delete"
             @click="handleClean"
             v-hasPermi="['monitor:job:remove']"
           >清空</el-button>
           <el-button
             type="warning"
             plain
             icon="Download"
             @click="handleExport"
             v-hasPermi="['monitor:job:export']"
           >导出</el-button>
           <el-button
             type="warning"
             plain
             icon="Close"
             @click="handleClose"
           >关闭</el-button>

           <ClockTimer :task="gGetList"/>
           <SearchAreaControl v-model="gShowSearchForm"/>
         </template>
         <template #plus-cell-action="scope">
           <el-button link type="primary" icon="View" @click="handleView(scope.row)" v-hasPermi="['monitor:job:query']">详细</el-button>
         </template>
       </plus-table>
     </div>
   </div>

  <!-- 调度日志详细 -->
  <el-dialog title="调度日志详细" v-model="open" width="700px" append-to-body>
    <el-form :model="form" label-width="100px">
      <el-row>
        <el-col :span="12">
          <el-form-item label="日志序号：">{{ form.jobLogId }}</el-form-item>
          <el-form-item label="任务名称：">{{ form.jobName }}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="任务分组：">{{ form.jobGroup }}</el-form-item>
          <el-form-item label="执行时间：">{{ form.createTime }}</el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="调用方法：">{{ form.invokeTarget }}</el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="日志信息：">{{ form.jobMessage }}</el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="执行状态：">
            <div v-if="form.status == 0">正常</div>
            <div v-else-if="form.status == 1">失败</div>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="异常信息：" v-if="form.status == 1">{{ form.exceptionInfo }}</el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="open = false">关 闭</el-button>
      </div>
    </template>
  </el-dialog>

</template>

<script setup name="JobLog">
import { getJob, listJob } from '@/api/monitor/job'
import { listJobLog, delJobLog, cleanJobLog } from "@/api/monitor/jobLog";
import ClockTimer from '@/components/PlusTableEnhance/Toolbar/clockTimer.vue'
import SearchAreaControl from '@/components/PlusTableEnhance/Toolbar/searchAreaControl.vue'
import { PlusTable } from 'plus-pro-components'
import TableTitle from '@/components/Table/TableTitle.vue'
import { useTablePage } from '@/hooks/useTablePage.js'
import { cloneDeep } from 'lodash'
import { formatRangeTime } from '@/utils/index.js'

const { proxy } = getCurrentInstance();
const { sys_common_status, sys_job_group } = proxy.useDict("sys_common_status", "sys_job_group");


const searchForm = ref({})

const {
  gGetList,
  gSelection,
  getBinds,
  getSearchBinds,
  gShowSearchForm,
} = useTablePage(listJobLog, {
  searchForm,
  init:false,
  beforeRequest(query) {
    const _query = cloneDeep(query)
    let { runTime, ...rest } = _query;
    let timeRange = formatRangeTime(runTime,undefined,'YYYY-MM-DD')
    console.log({
      ...rest,
      params:timeRange
    })
    return {
      ...rest,
      params:timeRange
    }
  }
})

const columns = computed(() => {
  return [
    {
      label: '日志编号',
      prop: 'jobLogId',
      hideInSearch: true,
      tableColumnProps: {
        align: 'center',
      }
    },
    {
      label: '任务名称',
      prop: 'jobName',
      tableColumnProps: {
        align: 'center',
      },
    },
    {
      label: '任务组名',
      prop: 'jobGroup',
      tableColumnProps: {
        align: 'center',
      },
      options: sys_job_group.value,
      valueType: 'select',
    },
    {
      label: '调用目标字符串',
      prop: 'invokeTarget',
      hideInSearch: true,
      tableColumnProps: {
        align: 'center',
      }
    },
    {
      label: '日志信息',
      prop: 'jobMessage',
      hideInSearch: true,
      tableColumnProps: {
        align: 'center',
      }
    },
    {
      label: '执行状态',
      prop: 'status',
      tableColumnProps: {
        align: 'center',
      },
      options: sys_common_status.value,
      valueType: 'select',
    },
    {
      label: '执行时间',
      prop: 'jobMessage',
      hideInSearch: true,
      tableColumnProps: {
        align: 'center',
      },
      render:val=>proxy.parseTime(val)
    },
    {
      label: '操作',
      prop: 'action',
      hideInSearch: true,
      minWidth: '80px',
      tableColumnProps: {
        align: 'center',
      }
    },
  ]
})



const open = ref(false);
const route = useRoute();
const data = reactive({
  form: {},
});

const { form } = toRefs(data);


// 返回按钮
function handleClose() {
  const obj = { path: "/monitor/job" };
  proxy.$tab.closeOpenPage(obj);
}

/** 详细按钮操作 */
function handleView(row) {
  open.value = true;
  form.value = row;
}
/** 删除按钮操作 */
function handleDelete(row) {
  const ids = row.jobLogId || gSelection.value.map(item => item.jobLogId).join(',')
  proxy.$modal.confirm('是否确认删除调度日志编号为"' + ids + '"的数据项?').then(function () {
    return delJobLog(ids);
  }).then(() => {
    gGetList();
    proxy.$modal.msgSuccess("删除成功");
  }).catch(() => {});
}
/** 清空按钮操作 */
function handleClean() {
  proxy.$modal.confirm("是否确认清空所有调度日志数据项?").then(function () {
    return cleanJobLog();
  }).then(() => {
    gGetList();
    proxy.$modal.msgSuccess("清空成功");
  }).catch(() => {});
}
/** 导出按钮操作 */
function handleExport() {
  proxy.download("monitor/jobLog/export", {
    ...searchForm.value,
  }, `job_log_${new Date().getTime()}.xlsx`);
}

(() => {
  const jobId = route.params && route.params.jobId;
  if (jobId !== undefined && jobId != 0) {
    getJob(jobId).then(response => {
      searchForm.value.jobName = response.data.jobName;
      searchForm.value.jobGroup = response.data.jobGroup;
      gGetList();
    });
  } else {
    gGetList();
  }
})();
</script>
